<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">


    <title>H+ 测试项目 - 登录</title>

    <link th:href="@{img/favicon.ico}" rel="shortcut icon">
    <link th:href="@{css/bootstrap.min.css}" rel="stylesheet">
    <link th:href="@{css/font-awesome.css}" rel="stylesheet">

    <link th:href="@{css/animate.css}" rel="stylesheet">
    <link th:href="@{css/style.css}" rel="stylesheet">
</head>

<body class="gray-bg">

    <div class="middle-box text-center loginscreen  animated fadeInDown">
        <div>
            <div>

                <h1 class="logo-name">H+</h1>

            </div>
            <h3>欢迎使用 H+</h3>

            <form class="m-t" role="form" action="/index">
                <div class="form-group">
                    <input type="text" name="loginName" id="loginName" class="form-control" placeholder="用户名" required="">
                </div>
                <div class="form-group">
                    <input type="password" name="loginPwd" id="loginPwd" class="form-control" placeholder="密码" required="">
                </div>
                <button id="tijiao" type="button" class="btn btn-primary block full-width m-b">登 录</button>


                <p class="text-muted text-center">
                    <a href="login.html#">
                        <small>忘记密码了？</small>
                    </a> |
                    <a href="register.html">注册一个新账号</a>
                </p>

            </form>
        </div>
    </div>

    <!-- 全局js -->
    <script th:src="@{js/jquery.min.js}"></script>
    <script th:src="@{js/bootstrap.min.js}"></script>
    <script>
        $(document).ready(function(){
            $("#tijiao").on("click",function(){
                var name = $("#loginName").val();
                var pwd = $("#loginPwd").val();
                $.ajax({
                    type:"post",
                    url:"/login",
                    datatype:"json",
                    data:{loginName:name,loginPwd:pwd},
                    success:function(data){
                        if(data.code == 1){
                            alert(data.msg);
                            var userId = data.data.userId;
                            window.location="/index?userId="+userId;
                        }else{
                            alert(data.msg);
                        }
                    }
                });
            })

        });
    </script>

</body>

</html>
